<template>
  <view class="paddingL15" style="padding-top: 30rpx;">
    <view v-show="!loading">
      <view class="lineItem row bgc pding25" style="justify-content: space-between;">
        <text class="labelStyle">企业名称</text>
        <view class="valueStyle">{{ reportDetail.enterpriseName ? reportDetail.enterpriseName : '-' }}<text
            style="color: #488AFD;margin-left: 10rpx" v-if="taskId || shareCode"
            @click="copy(reportDetail.enterpriseName)">复制</text></view>
      </view>
      <view class="lineItem row  pding25">
        <text class="labelStyle" style="">当前法人姓名</text>
        <text class="valueStyle">{{ reportDetail.legalPerson ? reportDetail.legalPerson : '-' }}</text>
      </view>
      <view class="lineItem row bgc pding25" style="">
        <text class="labelStyle">法人年龄(岁)</text>
        <text class="valueStyle">{{ reportDetail.age ? reportDetail.age : '-' }}</text>
      </view>
      <view class="lineItem row pding25">
        <text class="labelStyle" style="">法人是否占股</text>
        <text class="valueStyle">{{ reportDetail.stockStatus ? '是' : '否' }}</text>
      </view>
      <view class="lineItem row bgc pding25" style="">
        <text class="labelStyle">法人股份占比(%)</text>
        <text class="valueStyle">{{ reportDetail.stockPercent ? `${$p(reportDetail.stockPercent)}%` : '-' }}</text>
      </view>
      <view class="lineItem row pding25">
        <text class="labelStyle" style="">成立日期</text>
        <text class="valueStyle">{{ reportDetail.registerDate ? reportDetail.registerDate : '-' }}</text>
      </view>
      <view class="lineItem row bgc pding25" style="">
        <text class="labelStyle">成立时长</text>
        <text class="valueStyle">{{ reportDetail.registerMonth ? `${reportDetail.registerMonth}个月` :
          reportDetail.registerMonth == 0 ? reportDetail.registerMonth + '个月' : '-' }}</text>
      </view>
      <view class="lineItem row pding25">
        <text class="labelStyle" style="">统一信用代码</text>
        <view class="valueStyle">{{ reportDetail.creditCode ? reportDetail.creditCode : '-' }}<text
            v-if="reportDetail.creditCode && (taskId || shareCode)" @click="copy(reportDetail.creditCode)"
            style="color: #488AFD;margin-left: 10rpx">复制</text></view>
      </view>
      <view class="lineItem row bgc pding25" style="">
        <text class="labelStyle">行业分类</text>
        <text class="valueStyle">{{ reportDetail.industry ? reportDetail.industry : '-' }}</text>
      </view>
      <view class="lineItem row pding25">
        <text class="labelStyle" style="">注册类型</text>
        <text class="valueStyle">{{ reportDetail.loginRegisterType ? reportDetail.loginRegisterType : '-' }}</text>
      </view>
      <view class="lineItem row bgc pding25" style="">
        <text class="labelStyle">注册区域</text>
        <view class="valueStyle">{{ reportDetail.registerAddress ? reportDetail.registerAddress : '-' }}</view>
      </view>
      <view class="lineItem row pding25">
        <text class="labelStyle">基本户</text>
        <view class="valueStyle">{{ reportDetail.openAccountBank ? reportDetail.openAccountBank : '-' }}</view>
      </view>
      <view v-if="reportDetail.enterpriseChange" class="lineItem row">
        <text class="labelStyle" style="">{{ reportDetail.enterpriseChange && reportDetail.enterpriseChange.name
          }}</text>
        <view class="valueStyle">
          <!-- #ifdef MP-TOUTIAO -->
          <uv-read-more :shadowStyle="shadowStyle" textIndent="0" closeText="全部" openText="收起" show-height="100rpx"
            :toggle="true">
            {{ reportDetail.enterpriseChange && reportDetail.enterpriseChange.beforeContent }}
          </uv-read-more>
          <!-- #endif -->
          <!-- #ifdef H5 || APP-PLUS || MP-WEIXIN -->
          <readMore :isPopup="true" :title="`${reportDetail.enterpriseChange.name}变更前`" hideLineNum="2" showHeight="50">
            {{ reportDetail.enterpriseChange && `变更前：${reportDetail.enterpriseChange.beforeContent}` }}
            <template #content>
              <view>{{ reportDetail.enterpriseChange.beforeContent }}</view>
            </template>
          </readMore>
          <!-- #endif -->
        </view>
      </view>
      <view v-if="reportDetail.enterpriseChange" class="lineItem row">
        <text class="labelStyle" style=""></text>
        <view class="valueStyle">
          <!-- #ifdef MP-TOUTIAO -->
          <uv-read-more :shadowStyle="shadowStyle" textIndent="0" closeText="全部" openText="收起" show-height="100rpx"
            :toggle="true">
            {{ reportDetail.enterpriseChange && reportDetail.enterpriseChange.affterContent }}
          </uv-read-more>
          <!-- #endif -->
          <!-- #ifdef H5 || APP-PLUS || MP-WEIXIN -->
          <readMore :isPopup="true" :title="`${reportDetail.enterpriseChange.name}变更后`" hideLineNum="2" showHeight="50">
            {{ reportDetail.enterpriseChange && `变更后：${reportDetail.enterpriseChange.affterContent}` }}
            <template #content>
              <view>{{ reportDetail.enterpriseChange.affterContent }}</view>
            </template>
          </readMore>
          <!-- #endif -->
        </view>
      </view>
      <view class="table" v-if="tableData" style="position:relative;">
        <view v-if="isDemo != ''"
          style="position:absolute;z-index: 99;left: 50%;top: 50%;transform: translate(-50%,-50%)">
          <image src="/pagesWater/static/waterLogo.png" style="width: 320rpx;height: 200rpx"></image>
        </view>
        <!-- 添加组件 -->

      </view>
      <view class="lineItem row pding25" style="background: #F1F5F9;margin-top: 20rpx;margin-bottom: 20rpx">
        <text class="labelStyle" style="">银税互动授权记录</text>
        <view class="valueStyle">{{ reportDetail.bankTaxRecord }}</view>
      </view>

      <view class="shaoldtable" style="position:relative;">
        <view style="font-weight: bold;margin-bottom: 20rpx">股东明细</view>
        <view v-if="isDemo != ''"
          style="position:absolute;z-index: 99;left: 50%;top: 50%;transform: translate(-50%,-50%)">
          <image src="/pagesWater/static/waterLogo.png" style="width: 320rpx;height: 200rpx"></image>
        </view>
        <!-- 添加组件 -->
        <tableData :tableTitleData="shaoldtableData">
          <view style="display: flex" class="data-row" v-for="(item, index) in qccEnterprisePartnersList" :key="index">
            <view :style="{ width: (100 / qccEnterprisePartnersList.length) + '%' }" class="data-cell">
              <readMore :isPopup="true" :title="'股东名称'" hideLineNum="2" showHeight="50">
                {{ item.stockName }}
                <template #content>
                  <view>{{ item.stockName }}</view>
                </template>
              </readMore>
            </view>
            <!-- <view :style="{width: (100 / tenCustable.length) + '%'}" class="data-cell" style="justify-content: flex-start">{{ item.month }}</view> -->
            <view :style="{ width: (100 / qccEnterprisePartnersList.length) + '%' }" class="data-cell">{{
              item.stockType ? item.stockType : '-' }}</view>
            <view :style="{ width: (100 / qccEnterprisePartnersList.length) + '%' }" class="data-cell">{{
              item.shouldCapi ? item.shouldCapi : '-' }}</view>
            <view :style="{ width: (100 / qccEnterprisePartnersList.length) + '%' }" class="data-cell">{{
              item.stockPercent ? `${$p(item.stockPercent)}%` : '-' }}</view>
          </view>
          <view v-if="JSON.stringify(qccEnterprisePartnersList) == '[]'"
            style="text-align: center;line-height: 100rpx;height: 100rpx;font-size: 26rpx;color: #888888">
            暂无数据
          </view>
        </tableData>
        <view style="margin-top: 20rpx">
          <view style="font-weight: bold;margin-bottom: 20rpx;">经营范围</view>
          <view style="margin-top: 20rpx;">

            <view class="valueStyle"
              style="line-height: 40rpx;background: #F1F5F9; width: 100%; padding: 20rpx; text-align: left;">
              {{ reportDetail.businessScope ? reportDetail.businessScope : '-' }}</view>
          </view>
        </view>
      </view>
    </view>
    <loading :show="loading"></loading>

  </view>
</template>

<script>
import readMore from '@/components/xzj-readMore.vue'
import { getTableWidth } from "@/utils/date";
import { getReportDetailApi, getReportDetailByShareApi, } from '@/api/user'
import { detailInfo } from '../../options'
// 添加组件
import tableData from "@/components/tableData.vue";
import cache from "@/utils/cache";
export default {
  // 添加组件
  components: {
    tableData,
    readMore
  },
  data() {
    return {
      table: [],
      shaoldTable: [],
      tableWidth: '',
      shaoldtableWidth: '',
      tableData: [
        { title: '变更类型' },
        { title: '变更时间' },
        { title: '变更前' },
        { title: '变更后' },
      ],
      shaoldtableData: [
        { title: '股东名称' },
        { title: '股东类型' },
        { title: '参股数额（万）' },
        { title: '参股比例' },
      ],
      reportDetail: {},
      qccEnterprisePartnersList: [],
      // 添加组件
      arrobj: [{ title: '月份' }],
      objarr: [],
      loading: false,
    }
  },
  props: {
    shareCode: {
      type: String,
      default: ''
    },
    taskId: {
      type: String,
      default: ''
    },
    isDemo: {
      type: String,
      default: ''
    }
  },


  computed: {
    shadowStyle() {
      return {
        // #ifndef APP-NVUE
        backgroundImage: "none",
        // #endif
        // #ifdef APP-NVUE
        // nvue上不支持设置复杂的backgroundImage属性
        backgroundImage: "none",
        // #endif
        backgroundImage: 'none',
        paddingTop: "100px",
        marginTop: "-100px",
      }
    }
  },

  created() {
    this.loading = true
    setTimeout(() => {
      if (!this.taskId && !this.shareCode) {
        this.reportDetail = detailInfo.data
        this.loading = false
      } else {
        if (this.taskId) {
          this.getReportDetail()
        } else {
          this.getShareDetail()
        }
      }
    }, 100)


  },

  mounted() {
    this.$nextTick(() => {
      getTableWidth('.table', this.tableData.length + 1, this, 2).then(res => {
        this.tableWidth = res
      })
      getTableWidth('.shaoldtable', this.shaoldtableData.length + 1, this, 2).then(res => {
        this.shaoldtableWidth = res
      })
    })
  },

  methods: {
    // 需添加隐私保护
    copy(v) {
      uni.setClipboardData({
        data: v,
        success: function () {
          this.$util.Tips('链接复制成功,快去分享给好友吧~')
        }
      })
    },
    //获取企业报告详情
    // 分享链接查询详情
    getShareDetail() {
      getReportDetailByShareApi({
        shareCode: this.shareCode
      }).then(res => {
        if (res.code == 200) {
          this.reportDetail = res.data
          this.qccEnterprisePartnersList = res.data.qccEnterprisePartnersList
          this.$emit('getInfo', res.data)
          // #ifdef H5
          this.setWXConfig()
          // #endif
          this.loading = false
        }
        this.authBtn(res)

      }).finally(() => {
        this.loading = false
      })
    },
    //判断是否显示授权按钮权限
    authBtn(v) {
      if (v.code == 403) {
        return this.$emit('authBtn', false)
      }
      if (v.code == 200) {
        return this.$emit('authBtn', v.data)
      }

    },
    //获取企业报告详情
    getReportDetail() {
      let params = {
        taskId: this.taskId
      }
      getReportDetailApi(params).then(res => {
        this.reportDetail = res.data
        this.qccEnterprisePartnersList = res.data.qccEnterprisePartnersList
        this.loading = false
      }).finally(() => {
        this.loading = false
      })
    },
    setWXConfig() {
      const userinfo = cache.get("USER_INFO") ? JSON.parse(cache.get("USER_INFO")) : {};
      let opt = {
        title: this.reportDetail.enterpriseName || '',
        desc: "点击查看",
        link: this.$util.getPageUrl({
          shareCode: this.shareCode,
          spreadUid: userinfo?.id || '',
        },
          "pagesWater/taxSearch/companyDetail"
        ),
      };
      // console.log("link", opt);
      this.$util.setWXConfig(opt);
    },
  }

}
</script>

<style lang="scss" scoped>
.bgc {
  background-color: #F1F5F9;
}

.pding25 {
  padding: 0 25rpx !important;
}

/deep/ .xzj {
  color: #222 !important;
}

/deep/ .watchMore {
  margin-top: 0;
  font-size: 24rpx;
}

.labelStyle {
  width: 40%;
  padding-right: 30rpx;
  display: inline-block;
  text-align: left;
  color: #A8A8A8;
}

.valueStyle {
  // width: 60%;
  text-align: right;
  line-height: 35rpx;
  height: auto
}

.lineItem {
  min-height: 80rpx;
  padding: 20rpx 0 10rpx 0;
}
</style>
